(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "react", "./common"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    const React = require("react");
    const common_1 = require("./common");
    class Tabs extends React.Component {
        constructor(props) {
            super(props);
            this.state = { activeIndex: this.props.defaultActiveIndex || 0 };
        }
        componentDidMount() {
            setTimeout(() => {
                let scroller;
                if (this.props.scroller != null) {
                    scroller = this.props.scroller();
                }
                if (scroller == null) {
                    return;
                }
                let scrollTop;
                scroller.addEventListener('scroll', (event) => {
                    if (scrollTop == null) {
                        scrollTop = scroller.scrollTop;
                        return;
                    }
                    if (scroller.scrollTop - scrollTop > 0) { //向上 >0 //page.dataView.scrollTop > 100
                        if (scroller.scrollTop > 100)
                            this.element.style.top = '0px';
                    }
                    else {
                        this.element.style.removeProperty('top');
                    }
                    scrollTop = scroller.scrollTop;
                });
            }, 500);
        }
        activeItem(index) {
            // this.state.activeIndex = index;
            // this.setState(this.state);
            this.setState({ activeIndex: index });
            if (this.props.onItemClick) {
                this.props.onItemClick(index);
            }
        }
        render() {
            let children = common_1.getChildren(this.props);
            let itemWidth = 100 / children.length;
            return (React.createElement("ul", { ref: (o) => this.element = o, className: this.props.className, style: { transition: '0.4s' } }, children.map((o, i) => (React.createElement("li", { key: i, onClick: () => this.activeItem(i), className: i == this.state.activeIndex ? 'active' : '', style: { width: `${itemWidth}%` } }, (o))))));
        }
    }
    exports.Tabs = Tabs;
});
